import React from "react";

import { fetchData,setStoreItem,getStoreItem} from '../../common';

import {Badge,Select} from 'antd';

import UIIcon from '../../uicomponents/UIIcon';

const Option = Select.Option;

/** 
 * 产品模型包选择
*/
export default class ProductDatabaseSelect extends React.Component {

	constructor(props) {
		super(props);
		this.databaseList = fetchData('PRODUCT/MODEL/productDatabase/getProductDatabases', {});
	}


	renderDatabase = (database) => {
		let color = "processing";
		if ('IN_USE' === database.status) {
			color = 'processing'
		}
		else if ('CLOSED' === database.status) {
			color = 'error'
		}

		return (<Badge status={color} style={{ marginLeft: 6 }} text={<span><UIIcon icon='database' />{database.databaseName}</span>} />)
	}

	handleSelect = (value, opt) => {
		setStoreItem('lastSelectDatabaseId', value);
		if (this.props.onSelectDatabase) {
			this.props.onSelectDatabase(opt.props.database);
		}
	}

	render() {
		const { databaseList } = this;
		return (
			<Select style={{ width: 250 }}
				onSelect={this.handleSelect}
				placeholder="请选择数据库"
				defaultValue={getStoreItem('lastSelectDatabaseId',0)}
			>
				{databaseList.map(database => (
					<Option key={'database' + database.id} database={database} value={database.id + ''}>{this.renderDatabase(database)}</Option>
				))}
			</Select>
		);
	}
}
